<template>
<span>
    <Input v-model="showLabel" placeholder="请选择会员" :readonly="true">
        <Icon slot="suffix" type="md-reorder" @click="handleShowSelectModal"/>
    </Input>
    <ModalView ref="modalView" @singleSelect="handleDataSelected"/>
</span>
</template>

<script>
    import ModalView from './modalView'

    export default {
        props: {
            value: {
                default: ''
            },
            label: {
                default: ''
            }
        },
        watch: {
            label: {
                immediate: true,
                handler() {
                    this.showLabel = this.label||this.value
                }
            }
        },
        data() {
            return {
                showLabel: ''
            }
        },
        components: {
            ModalView
        },
        methods: {
            handleDataSelected(row) {
                this.showLabel = row.nickName
                this.$emit('select', row)
            },
            handleShowSelectModal() {
                let selected = []
                if(this.value) {
                    selected = [{id: this.value}]
                }
                this.$refs.modalView.show(selected);
            }
        }
    }
</script>

<style lang="scss" scoped>

</style>